<template>
  <div class="createDistributor-container">
    <el-form ref="form" :model="form" label-width="80px" style="width: 500px">
      <el-form-item label="姓名">
        <el-input v-model="form.name"></el-input>
      </el-form-item>
      <el-form-item label="电话">
        <el-input v-model="form.phone"></el-input>
      </el-form-item>
      <!-- <el-form-item label="电话">
        <el-input v-model="form.phone"></el-input>
      </el-form-item> -->
      <el-form-item label="级别">
        <el-select v-model="form.level" placeholder="请选择级别">
          <el-option
            v-for="(item, index) in subordinate"
            :key="index"
            :label="item.label"
            :value="item.val"
          ></el-option>
          <!-- <el-option label="区域二" value="beijing"></el-option> -->
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { getAllAreaApi } from '@/api/area'
import { CreateDistributorApi } from '@/api/distributor'
export default {
  data() {
    return {
      form: {
        name: '',
        phone: '',
        level: 3,
        area: ''
      },
      allarea: [],
      // subordinate:[]
      subordinate: [
        {
          label: '一级',
          val: 1
        },
        {
          label: '二级',
          val: 2
        },
        {
          label: '三级',
          val: 3
        }
      ]
    }
  },
  created() {
    // this.getArea()
  },
  methods: {
    async getArea() {
      this.allarea = await getAllAreaApi()
      console.log(this.allarea)
    },
    async onSubmit() {
      const res = await CreateDistributorApi(this.form)
      if (res)
        this.$notify({
          title: 'Success',
          message: '增加成功',
          type: 'success',
          duration: 2000
        })
      // console.log('submit!')
    }
  }
}
</script>

<style>
.createDistributor-container {
  margin-top: 10px;
}
</style>
